<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
	<th:block th:include="include :: header('新增文章')" />
	<th:block th:include="include :: datetimepicker-css" />
	<th:block th:include="include :: bootstrap-fileinput-css" />
	<th:block th:include="include :: select2-css" />
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
	<script type="text/javascript" charset="utf-8" th:src="@{/ueditor/ueditor.config.js}"></script>
	<script type="text/javascript" charset="utf-8" th:src="@{/ueditor/ueditor.all.js}"> </script>
	<script type="text/javascript" charset="utf-8" th:src="@{/ueditor/lang/zh-cn/zh-cn.js}"></script>
	<link type="text/css" rel="stylesheet" th:href="@{/ueditor/third-party/video-js/video-js.css}"/>
	<script  type="text/javascript" th:src="@{/ueditor/third-party/video-js/video.js}"></script>+
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
	<form class="form-horizontal m" id="form-notice-add">
		<div class="form-group">
			<label class="col-sm-2 control-label is-required">文章栏目：</label>
			<div class="col-sm-10">
				<select id="cloumn" name="cloumnCode" class="form-control" onchange="changeBox()" required>
					<option value="FA">找方案</option>
					<option value="XQ">发需求</option>
					<option value="ZJ">找专家</option>
					<option value="WT">提问题</option>
				</select>
			</div>
		</div>
		<div id="fa">
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">文章标题：</label>
				<div class="col-sm-10">
					<input id="fa-noticeTitle" class="form-control" type="text" required>
				</div>
			</div>
			<div class="form-group">
				<label class="col-xs-2 control-label is-required">产业分类：</label>
				<div class="col-xs-10">
					<select id="fa-industry" class="form-control select2-multiple" onchange="changeCount()" multiple>
						<option th:each="tag:${FAtags}" th:value="${tag.tagName}" th:text="${tag.tagName}"></option>
					</select>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">价格类型：</label>
				<div class="col-sm-10">
					<label class="radio-box"> <input type="radio" name="fa-priceType" value="1" /> 面谈 </label>
					<label class="radio-box"> <input type="radio" name="fa-priceType" value="2" /> 意向价格 </label>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label">意向价格：</label>
				<div class="col-sm-10">
					<input id="fa-price"  class="form-control" type="text" required>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">封面图：</label>
				<div class="col-sm-10">
					<input  id="imgfiles" name="file" accept=".png,.jpg,.gif,.bmp,.jpeg" class="form-control" type="file">
					<input  id="imageurl"   type="hidden">
				</div>
			</div>
		</div>
		<div id="xq">
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">文章标题：</label>
				<div class="col-sm-10">
					<input id="xq-noticeTitle"  class="form-control" type="text" required>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">发布对象：</label>
				<div class="col-sm-10">
					<input id="xq-object"  class="form-control" type="text" required>
				</div>
			</div>
			<div class="form-group">
				<label class="col-xs-2 control-label is-required">产业分类：</label>
				<div class="col-xs-10">
					<select id="xq-industry" class="form-control select2-multiple" multiple>
						<option th:each="tag:${XQtags}" th:value="${tag.tagName}" th:text="${tag.tagName}"></option>
					</select>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">价格类型：</label>
				<div class="col-sm-10">
					<label class="radio-box"> <input type="radio" name="xq-priceType" value="1" /> 面谈 </label>
					<label class="radio-box"> <input type="radio" name="xq-priceType" value="2" /> 意向价格 </label>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label">意向价格：</label>
				<div class="col-sm-10">
					<input id="xq-price"  class="form-control" type="text" required>
				</div>
			</div>
		</div>
		<div id="wt">
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">文章标题：</label>
				<div class="col-sm-10">
					<input id="wt-noticeTitle"  class="form-control" type="text" required>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">发布对象：</label>
				<div class="col-sm-10">
					<input id="wt-object"  class="form-control" type="text" required>
				</div>
			</div>
			<div class="form-group">
				<label class="col-xs-2 control-label is-required">产业分类：</label>
				<div class="col-xs-10">
					<select id="wt-industry" class="form-control select2-multiple" multiple>
						<option th:each="tag:${WTtags}" th:value="${tag.tagName}" th:text="${tag.tagName}"></option>
					</select>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">价格类型：</label>
				<div class="col-sm-10">
					<label class="radio-box"> <input type="radio" name="wt-priceType" value="1" /> 面谈 </label>
					<label class="radio-box"> <input type="radio" name="wt-priceType" value="2" /> 意向价格 </label>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label">意向价格：</label>
				<div class="col-sm-10">
					<input id="wt-price"  class="form-control" type="text" required>
				</div>
			</div>
		</div>
		<div id="zj">
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">专家名称：</label>
				<div class="col-sm-10">
					<input id="zj-noticeTitle"  class="form-control" type="text" required>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">学校：</label>
				<div class="col-sm-10">
					<input id="zj-school"  class="form-control" type="text" required>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">相关岗位/学院：</label>
				<div class="col-sm-10">
					<input id="zj-job"  class="form-control" type="text" required>
				</div>
			</div>
			<div class="form-group">
				<label class="col-xs-2 control-label is-required">研究方向：</label>
				<div class="col-xs-10">
					<select id="zj-industry" class="form-control select2-multiple" multiple>
						<option th:each="tag:${ZJtags}" th:value="${tag.tagName}" th:text="${tag.tagName}"></option>
					</select>
				</div>
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label is-required">文章内容：</label>
			<div class="col-sm-10">
				<textarea id="editors"    type="text/plain" style="width:1024px;height:500px;" name="content" ></textarea>
			</div>
		</div>

	<!--	<div class="form-group">
			<label class="col-sm-2 control-label">文章状态：</label>
			<div class="col-sm-10">
				<label class="toggle-switch switch-solid">
					<input type="checkbox" id="status"  checked>
					<span></span>
				</label>
			</div>
		</div>-->
	</form>
</div>
<th:block th:include="include :: footer" />
<th:block th:include="include :: datetimepicker-js" />
<th:block th:include="include :: bootstrap-fileinput-js" />
<th:block th:include="include :: select2-js" />
<script type="text/javascript">
	var prefix = ctx + "system/business";
	var pref = ctx + "system/cloumn";

	$("#isShuffling").on("change",function  () {
		var isShuffling = $("input[id='isShuffling']").is(':checked') == true ? 1 : 0;
		if (isShuffling == 0) {
			$("#div2").attr("style", "display:none;");
		} else {
			$("#div2").attr("style", "display:block;");
		}
	})
	$("#datetimepicker-demo-3").datetimepicker({
		format: "yyyy-mm-dd hh:ii:ss",
		autoclose: true,
		todayBtn :true
	});
	$("#imgfiles").fileinput({
		language: 'zh', //设置语言
		'showUpload': true,
		'previewFileType': 'image',
		'showPreview': true,
		'showClose': false,
		allowedFileExtensions: ["png","jpg","gif","bmp","jpeg"],//接收的文件后缀
		uploadAsync: true, //默认异步上传
		uploadUrl: ctx + "common/upload", //上传的地址
		dropZoneEnabled: false,//是否显示拖拽区域
		autoReplaceBoolean : false,//选择图片时不清空原图片
		maxFileCount: 9,
		deleteUrl: ""
	});
	var img_urls =  "";
	$('#imgfiles').on('fileuploaded', function(event, data, previewId, index) {
		if(typeof(data.response.url) != 'undefined'){
			img_urls = img_urls+data.response.url;
			$("#imageurl").val(img_urls);
		}
	});


	$("#form-notice-add").validate({
		focusCleanup: true
	});

	function submitHandler() {
		    var data = $("#form-notice-add").serializeArray();
		    var selected = $('#cloumn option:selected').val();
		    if('FA' === selected){
		       var title = $("#fa-noticeTitle").val();
               data.push({"name": "title", "value":title});
		    }else if('XQ' === selected){
		       var title = $("#xq-noticeTitle").val();
               data.push({"name": "title", "value":title});
		    }else if('WT' === selected){
		       var title = $("#wt-noticeTitle").val();
               data.push({"name": "title", "value":title});
		    }else if('ZJ' === selected){
		       var title = $("#zj-noticeTitle").val();
               data.push({"name": "title", "value":title});
		    }

            if('FA' === selected){
		       var industry = $.form.selectSelects("fa-industry");
               data.push({"name": "industry", "value":industry});
		    }else if('XQ' === selected){
		       var industry = $.form.selectSelects("xq-industry");
               data.push({"name": "industry", "value":industry});
		    }else if('WT' === selected){
		       var industry = $.form.selectSelects("wt-industry");
               data.push({"name": "industry", "value":industry});
		    }else if('ZJ' === selected){
		       var industry = $.form.selectSelects("zj-industry");
               data.push({"name": "industry", "value":industry});
		    }

		    if('FA' === selected){
			   var priceType = $('input[name="fa-priceType"]:checked').val();
               data.push({"name": "priceType", "value":priceType});
		    }else if('XQ' === selected){
		       var priceType = $('input[name="xq-priceType"]:checked').val();
               data.push({"name": "priceType", "value":priceType});
		    }else if('WT' === selected){
		       var priceType = $('input[name="wt-priceType"]:checked').val();
               data.push({"name": "priceType", "value":priceType});
		    }

		    if('FA' === selected){
			   var price = $("#fa-price").val();
               data.push({"name": "price", "value":price});
		    }else if('XQ' === selected){
		       var price = $("#xq-price").val();
               data.push({"name": "price", "value":price});
		    }else if('WT' === selected){
		       var price = $("#wt-price").val();
               data.push({"name": "price", "value":price});
		    }

		    var img = $("#imageurl").val();
		    data.push({"name": "img", "value":img});

			if('XQ' === selected){
		       var release = $("#xq-object").val();
               data.push({"name": "release", "value":release});
		    }else if('WT' === selected){
		       var release = $("#wt-object").val();
               data.push({"name": "release", "value":release});
		    }else if('ZJ' === selected){
		       var release = $("#zj-school").val();
               data.push({"name": "release", "value":release});
		    }

		    if('ZJ' === selected){
		       var post = $("#zj-job").val();
               data.push({"name": "post", "value":post});
		    }
			$.operate.save(prefix + "/add", data);
	}

	/*用户管理-新增-选择部门树*/
	function selectDeptTree() {
		var url = pref + "/selectTree"+$("#treeId").val();
		var options = {
			title: '选择栏目',
			width: "380",
			url: pref + "/selectTree/" + $("#treeId").val(),
			callBack: doSubmit
		};
		$.modal.openOptions(options);
	}
	function doSubmit(index, layero){
		var body = layer.getChildFrame('body', index);
		$("#treeId").val(body.find('#treeId').val());
		$("#treeName").val(body.find('#treeName').val());
		layer.close(index);
	}

	function changeCount(){
		var selected = $('#cloumn option:selected').val();
		if('FA' === selected){
			var faSelected = $.form.selectSelects("fa-industry");
			var array = faSelected.split(",");
			if(array.length > 3){
				$.modal.msgError("产业分类只能选3个!");
			}
		}
		if('XQ' === selected){
			var faSelected = $.form.selectSelects("xq-industry");
			var array = faSelected.split(",");
			if(array.length > 3){
				$.modal.msgError("产业分类只能选3个!");
			}
		}
		if('WT' === selected){
			var faSelected = $.form.selectSelects("wt-industry");
			var array = faSelected.split(",");
			if(array.length > 3){
				$.modal.msgError("产业分类只能选3个!");
			}
		}
		if('ZJ' === selected){
			var faSelected = $.form.selectSelects("wt-industry");
			var array = faSelected.split(",");
			if(array.length > 3){
				$.modal.msgError("研究方向只能选3个!");
			}
		}
	}

	function changeBox(){
		var selected = $('#cloumn option:selected').val();
		if('FA' === selected){
			$("#fa").show();
			$("#xq").hide();
			$("#wt").hide();
			$("#zj").hide();
		}else if('XQ' === selected){
			$("#fa").hide();
			$("#xq").show();
			$("#wt").hide();
			$("#zj").hide();
		}else if('WT' === selected){
			$("#fa").hide();
			$("#xq").hide();
			$("#wt").show();
			$("#zj").hide();
		}else if('ZJ' === selected){
		    $("#fa").hide();
			$("#xq").hide();
			$("#wt").hide();
			$("#zj").show();
		}
	}

	var ue = UE.getEditor('editors',{
	});

	$(function(){
		var ue = UE.getEditor('editors')
		ue.addListener("ready", function () {
		});

		var selected = $('#cloumn option:selected').val();
		if('FA' === selected){
			$("#fa").show();
			$("#xq").hide();
			$("#wt").hide();
			$("#zj").hide();
		}else if('XQ' === selected){
			$("#fa").hide();
			$("#xq").show();
			$("#wt").hide();
			$("#zj").hide();
		}else if('WT' === selected){
			$("#fa").hide();
			$("#xq").hide();
			$("#wt").show();
			$("#zj").hide();
		}else if('ZJ' === selected){
		    $("#fa").hide();
			$("#xq").hide();
			$("#wt").hide();
			$("#zj").show();
		}
	});
</script>
</body>
</html>
